<!DOCTYPE html>
<html>
<head>

</head>
<body id="app">

    <img id="image"src=""/>
    <br/>
    <!-- <input type="file"onchange="selectImage(this);"/> -->

    <input type="file" class="file" id="img">
    <br/>
    <input type="button"onclick="uploadImage();"value="submit"/>


    <script type="text/javascript" src="js/lib/jquery.min.js"></script>

    <script src="http://easydo.cn:9870/static/jquery.min.js"></script>
    <script src="http://easydo.cn:9870/static/jwplayer/jwplayer.js"></script>
    <script src="http://easydo.cn:9870/static/swfobject.js"></script>
    <script src="http://easydo.cn:9870/static/md5.js"></script>

    <script src="http://easydo.cn:9870/static/viewer.js"></script>
    <script src="http://easydo.cn:9870/static/main.js"></script>
    <!-- jquery plugins -->
    <script src="http://easydo.cn:9870/static/jquery.fullscreen.js"></script>
    <script src="http://easydo.cn:9870/static/slimbox2.js"></script>
    <!-- 没装Flash或移动端采用Box预览 -->
    <script src="http://easydo.cn:9870/static/box/dist/my.crocodoc.viewer.min.js"></script>
    <link type="text/css" href="http://easydo.cn:9870/static/box/dist/my.crocodoc.viewer.css" />


    <script>
        // var image = '';
        // function selectImage(file){
        //     if(!file.files || !file.files[0]){
        //         return;
        //     }
        //     var reader = new FileReader();
        //     reader.onload = function(evt){
        //         document.getElementById('image').src = evt.target.result;
        //         image = evt.target.result;
        //     };
        //     reader.readAsDataURL(file.files[0]);
        // }

        // function uploadImage(){
        //     $.ajax({
        //         type:'POST',
        //         url: 'ajax/uploadimage', 
        //         data: {image: image},
        //         async: false,
        //         dataType: 'json',
        //         success: function(data){
        //             if(data.success){
        //                 alert('上传成功');
        //             }else{
        //                 alert('上传失败');
        //             }
        //         },
        //         error: function(err){
        //             alert('网络故障');
        //         }

        //     });

        // }


  window.onload = function(){  
  
    // 选择图片  
    document.getElementById('img').onchange = function(){  
  
        var img = event.target.files[0];  
  
        // 判断是否图片  
        if(!img){  
            return ;  
        }  
  
        // 判断图片格式  
        if(!(img.type.indexOf('image')==0 && img.type && /\.(?:jpg|png|gif)$/.test(img.name)) ){  
            alert('图片只能是jpg,gif,png');  
            return ;  
        }  
  
        var reader = new FileReader();  
        
  
        // reader.onload = function(e){ // reader onload start  
        //      document.getElementById('image').src = e.target.result;
        //      //image = evt.target.result;
        // } // reader onload end  

         reader.onload = (function(theFile){
            return function(e){
                var img = document.createElement('img');
                img.title = theFile.name;
                img.src = e.target.result;
                document.body.appendChild(img); //这里你想插哪插哪  
            }
        })(img);
        reader.onerror = function(){
            alert("xx");
        }

        reader.readAsDataURL(img);  
    }  
  
  }  
  </script>  
</script>

</body>
</html>